import Vue from 'vue'
import Vuex from 'vuex'
import mine from "@/store/mine";
import user from "@/store/user";
import createPersistedState from 'vuex-persistedstate'
Vue.use(Vuex)

export default new Vuex.Store({
    plugins: [
        createPersistedState(),
    ],
    // vueX中存放的数据 相当于组件中的data
    state: {
        msg: '这是vueX存放的MSG',
        stateObj: {
            age: 20
        },
        count: 50,
        mineNum:666
    },
    // 对state中的数据进行初加工，相当于计算属性computed，会对数据进行缓存，但是不会改变state中的数据，会产生新的数据
    getters: {
        getCount(state) {
            console.log(state, 'state')
            return state.count
        },
        getMsg(state) {
            console.log(state, 'stateMsg')
        }
    },
    // 更改vueX中store数据的唯一方法 必须是同步的
    mutations: {
        // payload:传过来的参数
        setCount(state, payload) {
            console.log(state, 'mutations中的state')
            console.log(payload, 'mutations中的payload')
            // state.count=payload
            // state.count=payload.abc
            // state.count=payload[0]
            // state.count = payload.abc
            state.count = payload
        },
        setMsgMu(state, payload) {
            console.log(state, 'setMsgMu中的state')
            console.log(payload, 'setMsgMu中的payload')
            state.msg = payload
        },
        setMineNum(state, payload){
            console.log(state,'index setMineNum的state')
            console.log(payload,'index setMineNum的payload')
            state.mineNum = payload
        }
    },
    // 可以异步修改state中的数据 需要依赖mutations
    actions: {
        // context：上下文环境  payload：传过来的参数
        setMsg(context, payload) {
            console.log(context, 'setMsg的content')
            console.log(payload, 'setMsg的payload')
            setTimeout(() => {
                // context.commit('setMsgMu', payload.msgNew)
                context.commit('setMsgMu', payload)
            }, 1000)
        }
    },
    modules: {
        mine,
        user
    }
})
